<template>
	<view class="">
		<view class="nav flex algin">
			<view :class="['nav_item', navInd == 0?'nav_active':'']" @tap="changeNav(0)">
				关注
			</view>
			<view :class="['nav_item', navInd == 1?'nav_active2':'']" @tap="changeNav(1)">
				收藏
			</view>
		</view>
		<view class="gz" v-if="navInd == 0">
			<view class="gz_item flex justify" v-for="(item,index) in gzList" :key="index" @click="guanzhu(item)">
				<view class="info flex align">
					<image class="avator" :src="item.user.avatar" mode="aspectFill"></image>
					<view class="">
						<view class="user_name">{{item.user.encoded}}</view>
						<view class="flex align blue">
							<!-- <image class="addr" src="../../static/icon/addr.png" mode="aspectFill"></image> -->
							<text>{{item.user.label_name}}</text>
						</view>
					</view>
				</view>
				<view class="flex align">
					<!-- <image class="identIcon" v-if="item.user.is_verify == 0"
						src="../../static/icon/icon/my/renzheng.png" mode="aspectFill"></image> -->
					<image class="identIcon" v-if="item.user.is_verify == 1"
						src="../../static/icon/icon/home/renzheng.png" mode="aspectFill"></image>
					<text class="success_color" v-if="item.user.is_verify == 1">已认证</text>
					<!-- <text v-if="item.user.is_verify == 0">未认证</text> -->
				</view>
			</view>
		</view>
		<view class="sc" v-if="navInd == 1">
			<view class="item_list">
				<view v-for="(item,index) in scList" :key="index">
					<template v-if="user.group_id == 2">
						<card :scitem="item"></card>
					</template>
					<template v-if="user.group_id == 3">
						<project :scitem="item"></project>
					</template>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp()
	import project from "../../components/project.vue"
	import card from "../../components/card.vue"
	import common from "../../static/js/common.js"
	export default {
		components: {
			project: project,
			card: card
		},
		data() {
			return {
				user: app.globalData.user,
				navInd: 0,
				gzList: [],
				scList: [],
				page: 1,
				num: 10
			}
		},
		onLoad(options) {
			if (options.type) this.navInd = options.type
			if (this.navInd == 0) {
				this.getGzList()
			}
			if (this.navInd == 1) {
				this.page = 1
				this.scList = []
				this.getScList()
			}
		},
		onShow() {

		},
		methods: {
			guanzhu(item) {
				console.log(item)
				if(this.user.group_id == 3){
					uni.navigateTo({
						url: '/pages/userteam/userteam?id=' + item.focus_user_id
					})
				}else{
					uni.navigateTo({
						url: '/pages/TeamDetails/TeamDetails?id=' + item.focus_user_id
					})
				}
				
			},
			changeNav(index) {
				this.navInd = index
				if (index == 0) {
					this.gzList = []
					this.getGzList()
				}
				if (index == 1) {
					this.page = 1
					this.scList = []
					this.getScList()
				}
			},
			getGzList() {
				app.getData('addons/shopro/user_focus/focusList', {
					user_id: this.user.id
				}).then(res => {
					console.log(res)
					this.gzList = res.data.data.data
				})
			},
			getScList() {
				let url = ''
				let params = {
					page: this.page,
					num: this.num
				}
				if (this.user.group_id == 2) {
					url = 'addons/shopro/visiting_card/collectList'
				}
				if (this.user.group_id == 3) { //接包方
					url = 'addons/shopro/project/collectList'
				}
				
				app.getData(url, params).then(res => {
					console.log(res)
					if (res.data.code == 1) {
						this.scTotal = res.data.total
						res.data.data.data.forEach(item => {
							// if (this.user.group_id == 3) {
							// 	console.log('-', item.visiting.createtime)
							// 	item.createtime = common.timestampToDatetime(item.visiting.createtime)
							// }
						})
						this.scList = [...this.scList, ...res.data.data.data]
						console.log('this.scList', this.scList)
					}

				})
			},

		},
		onPullDownRefresh() {},
		onReachBottom() {
			console.log('上拉')
			if (this.page * this.num >= this.scTotal) {
				this.page = this.page + 1
				this.getScList()
			} else {
				uni.showToast({
					title: '没有更多了'
				})
			}
		},
		onShareAppMessage() {}
	}
</script>

<style lang="scss">
	page {
		background: #F7F7F7;
	}

	.nav {
		width: 285rpx;
		height: 60rpx;
		background-color: #fff;
		margin: 52rpx auto;
		border: 1rpx solid var(--base);
		color: var(--base);
		border-radius: 10rpx;

		.nav_item {
			width: 50%;
			line-height: 62rpx;
			text-align: center;
		}

		.nav_active {
			background-color: var(--base);
			color: #fff;
			border-top-left-radius: 10rpx;
			border-bottom-left-radius: 10rpx;
		}

		.nav_active2 {
			background-color: var(--base);
			color: #fff;
			border-top-right-radius: 10rpx;
			border-bottom-right-radius: 10rpx;
		}
	}


	.gz_item {
		background-color: #fff;
		border-radius: 10rpx;
		margin: 0 30rpx 30rpx;
		padding: 20rpx;

		.avator {
			width: 120rpx;
			height: 120rpx;
			border-radius: 50%;
			margin-right: 20rpx;
		}

		.user_name {
			font-size: 34rpx;
			font-weight: 600;
			margin-bottom: 20rpx;
		}

		.identIcon,
		.addr {
			width: 24rpx;
			height: 24rpx;
			margin-right: 10rpx;
		}
	}

	.success_color {
		color: #ffaa00;
	}

	.fail_color {
		color: red;
	}
	.blue{
		color: var(--base);
	}
</style>
